// 浏览器 html font-size 大小
$fs                     :1px !default;                               // 大小
$unit                   :1px !default;                               // 大小
// =============== function ===============
@function pxToRem($px){
    @return ($px / $fs) * $unit;
}
// rem
@function rem($px){
    @return ($px / $fs) * $unit;
}


// =============== 默认 ===============
$default                :#fff !default;                         // 默认色
$bg                     :#61B3E6 !default;                         // 默认背景色
$bg-hover               :#3AABF1 !default;                         // 默认背景色
$c                      :#fff !default;                            // 默认文字颜色
$pa-s                   :rem(8px) !default;                       // 默认小边距
$pa                     :rem(10px) !default;                      // 默认边距
$pa-m                   :$pa !default;
$pa-l                   :rem(15px) !default;                      // 默认中边距
$pa-xl                  :rem(20px) !default;                      // 默认大边距
$pa-admin               :rem(20px) !default;                      // 后台默认边距
$bor                    :#e2e2e2 !default;                         // 默认边框色
$wrap                   :640PX !default;                             // 适配宽度






$icon                   :#B5B8BD !default;                         // ico

// =============== 组件 ===============
$com-h                  :rem(36px) !default;                            // input btn 默认高度

// =============== 固定无法改变 ===============
$pa-f                   :rem(10px) !default;                          // 默认边距


// =============== 配色 ===============
$green                  :#5eb95e !default;
$green-c                :#fff !default;
$green-hover            :!default;
$green-hover-c          :!default;

$orange                 :#ff7d00 !default;
$orange-c               :#fff;
$orange-hover           :!default;
$orange-hover-c         :!default;

$red                    :#ed5657 !default;
$red-c                  :#fff !default;
$red-hover              :#d7342e !default;
$red-hover-c            :!default;

$yellow                 :#F7DD03 !default;
$yellow-c               :#fff !default;
$yellow-hover           : !default;
$yellow-hover-c         : !default;


$blue                   :#0c79b1 !default;
$blue-c                 :#fff !default;
$blue-hover             : !default;
$blue-hover-c           : !default;

$gray                   :#878787 !default;                         // 灰色
$gray-c                 :#fff !default;                         // 灰色
$gray-hover             :#d4d4d4 !default;                            // 灰色
$gray-hover-c           :!default;

$gray-light             :#c4c4c4 !default;                         // 浅灰         
$light-c                :#929292 !default;                         // 浅色文字
$light-bg               :#929292 !default;                         // 浅色背景

$blue                   :#3bb4f2 !default;
$blue-c                 :#fff;
$blue-hover             :!default;
$blue-hover-c           :!default;




$default-c				:#333 !default;
$default-bor			:#ccc !default;
$default-hover			:!default;;
$default-hover-c		:!default;
$default-hover-bor		:!default;









// =============== icon ===============
$icon-bg                :$icon !default;
$icon-c                 :$icon !default;
$icon-w                 :rem(15px) !default;
$icon-h                 :rem(15px) !default;

// =============== 情景色 ===============

$primary                :$bg !default;                             // 主色
$primary-c              :#fff !default;
$primary-hover          :$bg-hover !default;
$primary-hover-c        : !default;

$secondary              :#3bb4f2 !default;                         // 次色

$info                   :#E6F4FC !default;                         // 信息色
$info-bor               :#E6F4FC !default;                         
$info-c                 :#0090e0 !default;
$info-hover             :#E6F4FC !default;


$success                :#EBF9EC !default;                          // 成功
$success-bor            :#EBF9EC !default;                          
$success-c              :#34c240 !default;
$success-hover          : !default;


$warning                :#FFF6ED !default;                          // 警告
$warning-bor            :#FFF6ED !default;                          
$warning-hover          :#FFF6ED !default;                            
$warning-c              :#fa9f47 !default;                            

$danger                 :#FBECEC !default;                          // 错误
$danger-bor             :#FBECEC !default;                          
$danger-c               :#d64242 !default;
$danger-hover           : !default;

$disabled               :#f7f7f7 !default;                          // 禁止
$disabled-bor           :#d9d9d9 !default;                          
$disabled-c             :rgba(0,0,0,.25) !default;
$disabled-hover         : !default;
$disabled-hover-bor     : !default;
$disabled-hover-c       : !default;

$act                    :#FF8802 !default;
$active                 :$act !default;                           // 激活

// =============== fiexd ===============
$z                      : !default;                               // 头 z-index

// =============== 头部 ===============
$hd-bg                  :$bg !default;                             // 头部颜色
$hd-c                   :#fff !default;                            // 头部文字色
$hd-a-c					:$hd-c !default;						   // 头部a标签演
$hd-h                   :rem(45px) !default;                       // 头高度
$hd-lh                  :$hd-h !default;                       // 头line-height
$hd-z                   :2 !default;                               // 头 z-index
$hd-fs                  :rem(18px) !default;                       // 头高度
$hd-bor                 : !default;

// =============== 底部 ===============
$ft-bg                  :#fff !default;                            // 底部颜色
$ft-bor                 :1px solid $bor !default;                  // 边框
$ft-c                   :$gray !default;                           // 底部文字色
$ft-act-c               :$bg !default;                             // 底部文字色
$ft-h                   :rem(50px) !default;                            // 底部高度
$ft-z                   :2 !default;                               // z-index

// =============== nav ===============
$nav-h                  :rem(41px) !default;
$nav-bg                 :#F4F4F4 !default;
$nav-c                  :#5b5b5b !default;
$nav-act-c              :#ec4040 !default;


// =============== 列表 ===============
$list-li-bg             :#fff !default;                            // 列表li背景
$list-li-h              :rem(39px) !default;                            // 列表li高度
$list-li-bor            :$bor !default;                            // 列表li边框色
$align-w                :rem(70px) !default;                            // 对齐宽度

// =============== 按钮相关 ===============
$form-c                 : !default;                                // 表单颜色
$form-radius            : !default;                                // 表单背景

// =============== 按钮相关 ===============
$btn-bg                 :$bg !default;                             // 按钮背景色
$btn-hover-bg           : !default;                                // 按钮hover背景色
$btn-c                  :#fff !default;                            // 按钮文字色
$btn-bor                :1px solid $btn-bg !default;               // 按钮边框
$btn-a-c                :#fff !default;                            // 按钮文字链接色
$btn-h                  :$com-h !default;                          // 按钮高度
$btn-line-h             :rem(19px) !default;                       // 按钮高度
$btn-radius             :5px !default;                             // 按钮是否圆角
$btn-pa                 :0 rem(10px) !default;                     // 按钮padding
$btn-fs                 :rem(14px) !default;                       // 字体大小

$btn-s-fs				:rem(13px) !default;                       // 字体大小
$btn-s-radius           :$btn-radius !default;
$btn-s-min-w            :!default;

$btn-m-h                :rem(28px) !default;
$btn-m-min-w            :rem(56px) !default;
$btn-m-fs               :rem(14px) !default;                       
$btn-m-radius           :$btn-radius !default;                             

$btn-l-h                :rem(40px) !default;                       // 长按钮高度
$btn-l-fs               :rem(16px) !default;
$btn-min-w              : !default;                                // 按钮最小宽度

// $btn-act-bg             :$act !default;                            // 按钮激活背景色
// $btn-act-c              :$act-c !default;                          // 按钮激活文字颜色
// $btn-ban-bg             :$ban !default;                            // 按钮禁止背景色
// $btn-ban-c              :$ban-c !default;                          // 按钮禁止文字颜色


// =============== 按钮组 ===============
$btn-group-radius       : !default;

$btn-group-bg           :#fff !default;
$btn-group-c            :$bg !default;

$btn-group-act-bg       :$bg !default;
$btn-group-act-c        :#fff !default;


// =============== popup ===============
$popup-bg               :rgba(0, 0, 0, .5) !default;              // 弹窗背景色
$popup-z                :2 !default;                               // z-index


// =============== swiper ===============
$swiper-page-bg         :#E90000 !default;                         // swiper 分页按钮色
